<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<style>
		*{
			margin: 0;
			padding: 0;
		}
		
		.main{
			width: 600px;
			height: 1000px;
			background-color: red;
			display: flex;
			flex-direction: row;
			flex-wrap: wrap;
			justify-content: space-evenly;
			align-items: center;
			/* align-content: space-evenly; */
			}
		
		.main .a{
			width: 200px;
			height: 100px;
			background-color: aqua;
			order: 4;
		}
		
		.main .b{
			width: 200px;
			height: 100px;
			background-color: black;
			order: 3;
		}
		
		.main .c{
			width: 200px;
			height: 100px;
			background-color: brown;
			order: 2;
		}
		
	</style>
	
	<body>
		<div class="main">
			<div class="a"></div>
			<div class="b"></div>
			<div class="c"></div>
			
		</div>
		
	</body>
</html>